<template>
  <div>
    <h1>最外层组件</h1>
    <!-- 组件可以复用，在当前组件中哪里使用哪里调用即可 -->
    <niu-niu v-bind:msg="msg" :arr="arr"></niu-niu>
    <!-- <niu-niu></niu-niu> -->
    <hui-tai-lang></hui-tai-lang>
  </div>
</template>

<script>
import NiuNiu from "./components/NiuNiu";
import HuiTaiLang from "./components/testemit/HuiTaiLang.vue";
export default {
  name: "App",
  props: [""],
  data() {
    return {
      // 基本数据类型
      msg: "两位美女都很漂亮！！！",
      // 引用数据类型
      arr: [
        { name: "sunan", age: 18 },
        { name: "xuying", age: 17 },
      ],
    };
  },
  /* 写组件  引入组件 注册组件 调用组件 */
  /* 组件中的数据都是私有的，需要数据共享 组件之间传值 
  组件之间传值
  1.props 父传子 
  
  */
  components: {
    NiuNiu,
    HuiTaiLang,
  },
};
</script>
<style scoped>
</style>
